<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!-- 病案图片浏览页面 -->
<div class="easyui-layout" data-options="fit:true,border:0" >
	<div data-options="region:'north',split:false" class="north-min" style="border-left:0">
		<span class="paddingTBL">
			<span>您正在阅读病案&nbsp;&nbsp;</span>
			<span>病案号  </span>&nbsp;<span class="shootFontBold" id="Picture-view_fprn"></span>&nbsp;&nbsp;
			<span>住院ID</span>&nbsp;<span class="shootFontBold" id="Picture-view_fzyid"></span>&nbsp;&nbsp;
			<span>住院次数  </span>&nbsp;<span class="shootFontBold" id="Picture-view_ftimes"></span>&nbsp;&nbsp;
			<span>姓名  </span>&nbsp;<span class="shootFontBold" id="Picture-view_fname"></span>&nbsp;&nbsp;
			<span>出院日期  </span>&nbsp;<span class="shootFontBold" id="Picture-view_fcydate"></span>
		</span>
	</div>
	<div data-options="region:'west',split:false" style="width:20%;" class="Cancel_borderLB">
		<div class="easyui-layout" data-options="fit:true">
			<div data-options="region:'north'" style="width:100%;height:90%;">
				<ul id="Picture-view_tree"></ul>
			</div>
			<!-- 底部工具栏 start-->
		   	<div data-options="region:'south'" style="width:100%;height:10%;" class="Cancel_borderLB">
		    	<div class="paddingTBL" style="text-align: center;">  
			    	<a href="#" class="easyui-linkbutton" onclick="confirmPrint()">批量打印</a>
		      	</div>
			</div>
			<!-- 底部工具栏 end-->
		</div>
	</div>
	<div data-options="region:'east',split:false" style="width:80%;overflow:hidden;border-bottom:0">
	    <div class="easyui-layout" data-options="fit:true">
			  <div id="Pictureview-region" data-options="region:'center',split:false" style="display:none;border:0px solid red">
					<div id="Picture-view-Slider" ><ul></ul></div> 
					<!-- 遮盖层 star-->
					<div id="masking-layerIMG"> 
						<img src="<%=request.getContextPath()%>/image/closed.png" style="float:right;cursor: pointer;" onclick="closed()">
					</div>
					<div id="ShowLayerIMG"></div>
					<!-- 遮盖层 end--> 
			  </div>
			  <div id="pop-view" data-options="region:'center',split:false" style="border:0px solid red;width: 100%;height: 100%;">
					<!-- <div class="pdf"></div> -->
				    <iframe src="" frameborder="0" id="medicol_query_pdf_container" name="pdfContainer" frameborder="0" scrolling="no" style="width:99%; height:99%;"></iframe>
			  </div> 
			  
		</div> 
		<!-- <div class="lightbox" id="lightbox"></div> -->
    </div>
</div>

<!-- 单个申请图片分类dialog -->
<div id="singleApplyImg-dialog" class="easyui-dialog" data-options="closed:true" style="width:490px;">
		<form id="singleImg-applyForm" method="post">
		   <div class="paddingTBL">
				<p class="paddingB">
				    <span style="width:180px;">
					    <label>病案号:&nbsp;</label>
						<span id="applyImg-fprn" class="shootFontBold"></span>
					</span>  
					
					<span style="width:120px;">
						<label>姓名:&nbsp;</label>
						<span id="applyImg-fname" class="shootFontBold"></span>
					</span> 
					
					<span style="width:150px;">
						<label>出院日期:&nbsp;</label>
						<span id="applyImg-fcydate" class="shootFontBold"></span>
					</span>
				</p>
				<p class="paddingB">
					<label>申请目的&nbsp;</label>
					<input id="sApplyImg-purpose" name="sApplyImgPurpose"/>
					
					<span class="paddingL30"></span>
					
					<label>浏览天数&nbsp;</label>
					<input id="sBrowseImg-days" name="sBrowseImgDays" class="easyui-textbox" data-options="width:100,height:24" />
				</p>
				<p class="paddingB">
					<label>申请描述&nbsp;</label>
					<span style="vertical-align:middle;">
						<textarea name="sApplyImgRemark" style="resize:none;width:360px;height:50px;"></textarea>
					</span>
				</p>
		    <div class="paddingTBL">	
	    </form>
</div>

<div id="MedicolRecordPictureView-print-dialog" class="easyui-dialog" data-options="closed:true" style="width:400px;height:450px;">
	<div style="margin:0 auto;" id="MedicolRecordPictureView-print-table"></div>
</div>

<!-- media PDF查看-->

<%-- <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery/plug/media/jquery.media.js" ></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery/plug/media/jquery.metadata.js" ></script>
 --%><%-- <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery/plug/slides/responsiveslides.min.js"></script>
<script type="text/javascript" src='<%=request.getContextPath()%>/script/jquery/plug/viewer/jquery.js'></script> 
<script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery/plug/viewer/jqueryui.js" ></script>
<script type="text/javascript" src='<%=request.getContextPath()%>/script/jquery/plug/viewer/jquery.mousewheel.min.js'></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery/plug/viewer/jquery.iviewer.js"></script> --%>
 
<script type="text/javascript">
	var fprn = '<%=request.getParameter("fprn")%>';      //病案号
	var fzyid = '<%=request.getParameter("fzyid")%>';    //住院id
	var ftimes = '<%=request.getParameter("ftimes")%>';  //次数
	var fname = decodeURI('<%=request.getParameter("fname")%>');  //姓名
	var fcydate = '<%=request.getParameter("fcydate")%>';  //出院日期
	var id = '<%=request.getParameter("id")%>';  //申请id
	var fcode =$("#fcode").text(); //获取当前用户code
	$("#Picture-view_fprn").html(fprn);
	$("#Picture-view_fzyid").html(fzyid);
	$("#Picture-view_ftimes").html(ftimes);
	$("#Picture-view_fname").html(fname);
	$("#Picture-view_fcydate").html(fcydate);
	
	$(function(){  
	    
	  	//加载所有申请分类
		$("#sApplyImg-purpose").combobox({
			width:160,
			height:24,
			url : "systemMaintenance/loadApplyType",
			editable : false,
			valueField : "FID",
			textField : "FNAME",
			onLoadSuccess : function(data){
				if (data.length>0) {
				    $("#sApplyImg-purpose").combobox('select',data[0].FID);   //默认勾选第一个申请分类
				}
			},
			onLoadError : errorPromt
		});
	  	
		//获取树节点
		 $("#Picture-view_tree").tree({  
		    url: ctx + "/MedicalCheckManage/getTree",  
		    animate: true,
		    lines:true,
		    checkbox:true,
		    /* checkbox:function(node){
				if (node.path != null && node.path != ""){
					return true;
				}
			}, */
		    queryParams: {
		    	"fzyid": fzyid,
		    	"id": id
		    },
		    onLoadSuccess : function(node, data){
				var childrenNodes = data[0].children;
				for (var i = 0; i < childrenNodes.length; i++) {
				    //判断 子节点是否具有权限查看
				    if (childrenNodes[i].isJuris == 2) {
						$($("#Picture-view_tree").tree('find',childrenNodes[i].id).target).css('background', '#dcdcdc');
				    }
				}
		    },
		    formatter:function(node){
		    	if (node.fileName) {
		    		return "<a style=\"text-decoration: none; color: black; display: block;\" href=\"thirdparty/pdfjs/web/viewer.html?file=../../../file/"+ node.fileName +".pdf#page=" + (node.text) + "\" target=\"pdfContainer\" onclick=\"showPdf(true)\">" + "第" + node.text + "页" + "</a>";
		    	}
				return node.text;
			},
		    onSelect:function(node) {
		    
		    	
		    	document.getElementById("masking-layerIMG").style.display ="none";  
			    document.getElementById("ShowLayerIMG").style.display ="none"; 

			    if (node.type == 1){ //if (node.fileType) {
			    	if(node.path==null ||node.path==""){
	    				$.messager.alert("提示","未归档，没有可查看文件！","info");
	    				return ;
	    			}
	    			$("#module-info").css("display", "none");
		    		$("#Pictureview-region").css("display", "none");
		    		//$("#pop-view").css("display", "block");
	    			$.ajax({
		 	    		url: ctx + "/MedicalCheckManage/getFile",
		 	    		dataType : 'json',
		 	    		type : 'post',
		 	    		data:{
		 	    			"path" : node.path,
		 	    			"type" : type
		 	    		},
		 	    		success:function(data){
		 	    			$("#medicol_query_pdf_container").attr("src",ctx+"/viewer?file="+ctx+"/"+data.url);
		 	    			<%-- $('.pdf').media({ 
							   	width:     $("#pop-view").innerWidth()-10, 
							    height:    $("#pop-view").innerHeight()-10, 
							    autoplay:  true, 
							    src:       '<%=request.getContextPath()%>/'+data.url, 
							    //params: 	{toolbar:false},
							    caption:   false
							}); --%>
		 	    		},
		 	    		error:function(){
		 	    			$.messager.alert("提示","解密图片操作异常,请联系管理员！","info");
		 	    		}
	    			});
		    	} else {
		    		if(node.text != "病案封面") {
		    			//判断 子节点不具有权限，需要申请
		    		    if(node.isJuris == 2){
			    			$('#singleApplyImg-dialog').dialog({
				    			closed : false,
				    			modal : true,
				    			title : '申请浏览病案分类',
				    			buttons : [{
				    				text: '确认',
				    				iconCls: '',
				    				handler: function(){confirmSApplyImg(node.id, node.text);}
				    			},
				    			{text: '关闭',handler: function() {
				    				$("#singleApplyImg-dialog").dialog("close");
				    			}
				    			}]
					    	})
				    		
				    		$('#applyImg-fprn').text(fprn);
				    		$('#applyImg-fname').text(fname);
				    		$('#applyImg-fcydate').text(fcydate);
		    		    }else{
			    			if(node.path==null ||node.path==""){
			    				$.messager.alert("提示","未归档，没有可查看文件！","info");
			    				return ;
			    			}
				    		var type=node.fileType;
				    		if(type==1){//pdf
				    			$("#module-info").css("display", "none");
					    		$("#Pictureview-region").css("display", "none");
					    		//$("#pop-view").css("display", "block");
				    			$.ajax({
					 	    		url: ctx + "/MedicalCheckManage/getFile",
					 	    		dataType : 'json',
					 	    		type : 'post',
					 	    		data:{
					 	    			"path" : node.path,
					 	    			"type" : type
					 	    		},
					 	    		success:function(data){
					 	    			if(data.suc==false){
					 	    				$.messager.alert("提示","解密图片操作异常,请联系管理员！","info");
					 	    			}else{
					 	    				<%-- $('.pdf').media({ 
					 	    					preferMeta:false,
											   	width:     $("#pop-view").innerWidth()-10, 
											    height:    $("#pop-view").innerHeight()-10, 
											    autoplay:  true, 
											    src:       '<%=request.getContextPath()%>/'+data.url, 
											    //params: 	{toolbar:false},
											    caption:   false,
											    silverlight:{
											    	isWindowless: 'false', // 无窗口模式
											    }
											}); --%>
											$("#medicol_query_pdf_container").attr("src",ctx+"/viewer?file="+ctx+"/"+data.url);
					 	    			}
					 	    			
					 	    		},
					 	    		error:function(){
					 	    			$.messager.alert("提示","解密图片操作异常,请联系管理员！","info");
					 	    		}
				    			});
				    		}else{//图片
				    			$("#module-info").css("display", "block");
					    		$("#Pictureview-region").css("display", "block");
					    		//$("#pop-view").css("display", "none");
				    			//点击分为两种情况：情景一，直接点击图片;情景二：点击二级菜单;
								var id = node.id; 	//id绑定了图片编号
								var imgNumber = id.substring(id.lastIndexOf(",") + 1,id.length);	//拆分图片编号
						    	if(!node.children){  	//情景一
						    		var src = node.attributes;
						    		var isMore = false; //为false，则表示
						    		 $.ajax({
						 	    		url: ctx + "/MedicalShootManage/encodeIMG",
						 	    		dataType : 'json',
						 	    		type : 'post',
						 	    		data:{
						 	    			"path" : src,
						 	    			"isMore" : isMore
						 	    		},
						 	    		success:function(data){
						 	    			if(data.msg == true){
						 	    				$("#Picture-view-Slider").siblings("a").remove(); //先清空插件的元素
						 	    				
						 	    				if(src.substring(src.lastIndexOf(".")+1,src.length) == "jpg"){
									    			var parent = $("#Picture-view_tree").tree("getParent",node.target);
									    			var pageNumber = node.text;
									    			var path = node.attributes;
									    			var parentText = parent.text;//父类标题
									    			$("#current-templet").html(parentText);
									    			var cateNumber = parent.attributes;//图片分类编码
									    			var src2 = src.replace(/\\/g,'/');
									    			var index = src2.lastIndexOf("/");
									    			var imgSrc = src2.substring(index+1,src.length);
									    			var srcPath=ctx + "/upload/"+fcode+"/"+imgSrc; 
									    			$("#Picture-view-Slider").html( 
									    					  "<div class='wrapper'>"
									   			           		 + "<div id='picpViewer' class='viewer'></div><br/>"
									   			            + "</div>"  
									    					 
									    					+ "<div class='caption'>" +
									    							"<span class='PageNumber'>"+pageNumber+"&nbsp;"+parentText+"&nbsp;"+imgSrc+"</span>" +
									    							"<span class='auditImgNumber' style='display:none;'>"+imgNumber+"</span>" +
									    							"<span class='imgCategory' style='display:none;'>"+cateNumber+"</span>" +
									    							"<span class='imgPath' style='display:none;'>" + path + "</span>" +
									    							"<span class='pageCode' style='display:none;'>" + pageNumber + "</span>" +
									    					   "</div>" );  
									    			
									    			 $("#Picture-view-Slider").removeClass("slide");
		 							    			 slider_picpViewer("picpViewer",srcPath);
									    			 
									 			 	if(!node.children){ 
									 					$(".slide_nav").css("display",'none')
									 				}  
									    			//slider(); //渲染特效 
									    			/* $('#Picture-viewRoll').zoom({ on:'click' }); */
									    		}
						 	    			}else{
						 	    				$.messager.alert("提示","解解密图片操作异常,请联系管理员！","info");
						 	    			}				 	    			
						 	    		},
						 	    		error:function(){
						 	    			$.messager.alert("提示","解密图片操作异常,请联系管理员！","info");
						 	    		}
						 	    	});  
						    	} else {  //情景二
						    		putImg(node);
						    	}
				    		}
					    	
		    		    }
					}
		    	}
		    	
			}
		});	 
	});
	
	/**
	* 确认打印病例
	*/
	function confirmPrint(){
		var sum=0;
		$('#MedicolRecordPictureView-print-table').empty();
		var printURL=new Array();
		var checkedNodes = $('#Picture-view_tree').tree('getChecked');	// get checked nodes
		for (var i = 0; i < checkedNodes.length; i++) {
			var node=checkedNodes[i];
			if(node.path!=null && node.path!=""){
				sum++;
				printURL.push(node.path);//border:1px solid #4A4AFF;
			}
		}
		printURL.join(",");	
		if(sum==0){
			$.messager.alert('提示','没有可打印的病历！','info');
			return ;
		}
		var pdfurl="";
		var sumY=0;
		//获取可打印pdf
		$('#index_prompt').html("正在打印文件，请稍等...").dialog('open');
		$.ajax({
			url : "MedicalCheckManage/printPDF",
			dataType : 'json',
			type : 'post',
			async:false,
			data : {paths:encodeURI(printURL)},
			success : function(data){
				$('#index_prompt').dialog('close');
				if (data.result) {
					pdfurl=data.pdfurl;
					sumY=data.sum;
					var list=data.list;
					for (var i = 0; i < list.length; i++) {
						
						$('#MedicolRecordPictureView-print-table').append($('<div style="background-color:#C4C4C4;margin:2px;border:1px solid #333;padding:2px;height:25px;color:#fff;"><div style="display:inline;width:49%">'+list[i].filename+'</div><div style="display:inline;width:49%">'+list[i].msg+'</div></div>'));
					}
				}else{
					$.messager.alert('提示',data.msg,'info');
				}
			},error : errorPromt
		})
		//显示可打印列表
		$('#MedicolRecordPictureView-print-dialog').dialog({
			closed : false,
			modal : true,
			title : '病案可打印列表（共 '+sum+' 份,可打印  <font color="green">'+sumY+'</font> 份）',//
			buttons : [{
				text: '浏览打印',
				iconCls: '',
				handler: function(){
					$("#MedicolRecordPictureView-print-dialog").dialog("close");
					window.open(ctx+"/viewer?file="+ctx+"/"+pdfurl+"&title=<%=request.getParameter("fzyid")%>","病案浏览-<%=request.getParameter("fzyid")%>");
				}
			},
			{text: '取消',handler: function() {
				$("#MedicolRecordPictureView-print-dialog").dialog("close");
			}
			}]
    	})
	}
	//确认申请图片分类模板
	function confirmSApplyImg(imgid, imgname){
	  	//获取浏览天数
		var browseDays = $("#sBrowseImg-days").val();
		if (""==browseDays) {
			$.messager.alert('提示','浏览天数不能为空','info');
			return;
		}
		
		//判断浏览天数是否为数字格式
		if (regNumber(browseDays) == false) {
			$.messager.alert('提示','浏览天数非数字格式，请修改','info');
			return;
		}
		
		$.ajax({
			url : "MedicalCheckManage/confirmSApplyImg",
			dataType : 'json',
			type : 'post',
			data : $('#singleImg-applyForm').serialize()+"&fzyid="+fzyid+"&imgid="+imgid+"&imgname="+imgname,
			success : function(data){
				if (data) {
					$.messager.alert('提示','申请成功','info');
					$("#singleApplyImg-dialog").dialog("close");
				}else{
					$.messager.alert('提示','申请失败','info');
				}
			},error : errorPromt
		})
	}
	
	//显示PDF
	function showPdf(isShow){ 
		var state = "";
		if(isShow){
			state = "block";
		}else{
			state = "none";
		}
		//var pop = document.getElementById("pop-view");
		//pop.style.display = state;
		/* var lightbox = document.getElementById("lightbox");
		lightbox.style.display = state; */
	}
	function close(){
		showPdf(false);
	}
	 
	
	//关闭遮盖层
	function closed(){  
		document.getElementById("masking-layerIMG").style.display ="none";  
	    document.getElementById("ShowLayerIMG").style.display ="none";  
	}
	
	//打开遮盖层
	function imgClick(srcPath){ 
	  //var srcPath = $("li").find('img').prop("src"); 
	  document.getElementById("masking-layerIMG").style.display ="block"; 
	  document.getElementById("ShowLayerIMG").style.display ="block"; 
	  $("#ShowLayerIMG").html("");   //先清空
	  $("#ShowLayerIMG").html(
			    "<div class='wrapper'>"
	          	+ "<div id='ShowLayerIMG_iviewer' class='viewer iviewer_cursor'></div><br/>"
	            + "</div>" ); 
	  
	  slider_picpViewer("ShowLayerIMG_iviewer",srcPath);
	}
	
	//鼠标滚动_图片放大效果层
	function slider_picpViewer(iviewerId,srcPath){   
		  var $PA = jQuery; 
		  var viewer;
          viewer = $PA("#"+iviewerId).iviewer({
        	  src:srcPath
          });
	 
		/*  var $PA = jQuery; 
	     var iviewer = {};
	     $PA("#"+iviewerId).iviewer({
		      src:srcPath,
		      zoom: "fit",
		      zoom_min:30,
		      zoom_max: 400,
		      initCallback: function()
		      {   
		        iviewer = this;
		      } 
	     });  */
	}   
	
	function slider(){
	    $("#Picture-view-Slider").responsiveSlides({
		    auto: false,
		    pager: false,
		    nav: true,
		    speed: 500,
		    // 对应外层div的class : slide_container
		    namespace: "slide"
		});
	}
	
	//放置图片至浏览区域
	function putImg(node){
		var imgName = "";
		var html = "";
		var parent = $("#Picture-view_tree").tree("getNode",node.target);
		var parentText = parent.text;//父类标题
		var cateNumber = parent.attributes;//图片分类编码
		var parentChildren = parent.children;//父类的子节点数组
		$("#current-templet").html(parentText);
		var path = "";
		var isMore = true; //为true，则解密多个
		for (var j = 0; j < parentChildren.length; j++) {
			var originPath = parentChildren[j].attributes; //图片路径
			if(j >0){
				path += ","+originPath;
			}else{
				path += originPath;
			}
		}
		$.ajax({
			url: ctx + "/MedicalShootManage/encodeIMG",
			dataType : "json",
			type : "post",
			data : {
				"path" :path,
				"isMore" : isMore
			},
			success:function(data){
				if(data.msg == true){ 
					$("#Picture-view-Slider").siblings("a").remove(); //先清空插件的元素
					$("#Picture-view-Slider").html("");
					//循环获取子节点
					for (var i = 0; i < parentChildren.length; i++) {
						var src = parentChildren[i].attributes; //图片路径
						var pageNumber = parentChildren[i].text;//图片页码
						var id = parentChildren[i].id; //图片编号
						//拆分图片编号
						var imgNumber = id.substring(id.lastIndexOf(",")+1,id.length);
						//截取图片路径
						var src2 = src.replace(/\\/g,'/');
						var index = src2.lastIndexOf("/");
						var imgSrc = src2.substring(index+1,src.length);
						var srcPath=ctx + "/upload/"+fcode+"/"+imgSrc;
						html += "<li>"  
							        + "<img src='"+ ctx + "/upload/"+fcode+"/"+imgSrc+"' onclick=imgClick('"+srcPath+"')>" 
									/*+"<div class='wrapper'>"
					        		+"<div id='picpViewer"+i+"'"+" class='viewer iviewer_cursor' style='height:99%;overflow:scroll;'></div><br/>"
					                +"</div>" */
									+"<div class='caption'>" +
										"<span class='PageNumber'>" + pageNumber + "&nbsp;" + parentText + "&nbsp;" + imgSrc + "</span>" +
										"<span class='auditImgNumber' style='display:none;'>" + imgNumber + "</span>" +
										"<span class='imgCategory' style='display:none;'>" + cateNumber + "</span>" +
										"<span class='imgPath' style='display:none;'>" + src + "</span>" +
										"<span class='pageCode' style='display:none;'>" + pageNumber + "</span>" +
									"</div>" +
								"</li>";
					}
					$("#Picture-view-Slider").html(html);
					slider(); //渲染特效  
					
				/* 	for (var i = 0; i < parentChildren.length; i++) { 
						var src = parentChildren[i].attributes; //图片路径 
						//截取图片路径
						var src2 = src.replace(/\\/g,'/');
						var index = src2.lastIndexOf("/");
						var imgSrc = src2.substring(index+1,src.length);
						
						var srcPath=ctx + "/upload/"+fcode+"/"+imgSrc;
						slider_picpViewer("picpViewer"+i,srcPath); 
					}   */
				} 
				else{
					$.messager.alert("提示","解密图片操作异常,请联系管理员！","info");
				}
				
			},
			error:function(){
				$.messager.alert("提示","解密图片操作异常,请联系管理员！","info");
			}
			
		});
	}
	
</script>